import React from 'react';
import ReactDOM from 'react-dom';
import {List, Toast, Radio} from 'antd-mobile';
import mirror, {actions, connect} from 'mirrorx';
import {CompanyTypeEnum,BuildingStructTyepEnum,PropertyTypeEnum,UserTypeEnum,YesNoEnum} from './staticData';
import { createForm } from 'rc-form';
import RowInput from '../../component/Item/Input';
import RowSelect from '../../component/Item/Select';
import RowDate from '../../component/Item/DatePicker';
import Factor from '../../component/factor';
import Job from './job';
import RiskNotice from './riskNotice';

const RadioItem = Radio.RadioItem;

class App extends React.Component {
    constructor(props) {
        super(props);
        this.state = {           
            factorInfo: {}, // 保费试算因子信息
            companyInfo:{} //企业信息                    
        };
    }

    componentDidMount() {  
        let Insure4 = JSON.parse(sessionStorage.getItem('Insure4'));      
        let calculateVals = JSON.parse(sessionStorage.getItem('calculateVals'));
        if(Insure4){            
            let factorInfo = {
                companyType:Insure4.companyType || '',
                oneToThreeEmployeeNum: Insure4.oneToThreeEmployeeNum || '',
                fourEmployeeNum: Insure4.fourEmployeeNum || '',
                isExtensionClause: Insure4.isExtensionClause || ''
                }
            this.setState({
                companyInfo:Insure4,
                factorInfo:factorInfo
                });            
            this.onChangeFactor(factorInfo);
            return;
        }        
        if(calculateVals){
            this.onChangeFactor(calculateVals,true); 
            let factorInfo = {
                companyType:calculateVals.companyType || '',
                oneToThreeEmployeeNum: calculateVals.employeeNumberCategory123 || '',
                fourEmployeeNum: calculateVals.employeeNumberCategory4 || '',
                isExtensionClause: calculateVals.addClauseNonWorkHour || ''
            }
            this.setState({
                companyInfo:factorInfo,
                factorInfo:factorInfo
            })
        }        
    }
  
    onChangeCompanyInfo = (obj) =>{ //企业信息填写
        if(obj.hasOwnProperty('companyType') || obj.hasOwnProperty('oneToThreeEmployeeNum') || obj.hasOwnProperty('fourEmployeeNum') || obj.hasOwnProperty('isExtensionClause')){ //试算要素         
            Object.assign(this.state.factorInfo,obj);
            this.onChangeFactor(this.state.factorInfo);
            this.setState({factorInfo: this.state.factorInfo})
        }
        Object.assign(this.state.companyInfo,obj);
        this.setState({companyInfo:this.state.companyInfo});
    }

    onChangeInsurant = (obj) => {       
        if(obj.hasOwnProperty('insurantCertNo')){
            var a = this.isIdCard(Object.values(obj)[0])
            if( Object.prototype.toString.call(a) == "[object Object]" ){
                Object.assign(this.state.factorInfo, {
                    birthday: new Date(a.birthday).getTime(),
                    gender: a.genderCode
                })
                this.onChangeFactor(this.state.factorInfo);
            }
        }
        Object.assign(this.state.insurantInfo, obj)
        this.setState({insurantInfo: this.state.insurantInfo})
    }

    onChangeFactor = (factorInfo,session) => {
        let factorParam = {};
        if(session){
            factorParam  = factorInfo;
        }else{
            factorParam  = {
                employeeNumberCategory123: factorInfo.oneToThreeEmployeeNum || '',
                employeeNumberCategory4: factorInfo.fourEmployeeNum || '',
                companyType: factorInfo.companyType || '',            
                addClauseNonWorkHour: factorInfo.isExtensionClause || ''
            }
        }       
        let params = [{
            "bizTopic": "PREMIUM",
            "factorParams": factorParam,
            "id": T.urlQuery('planId') // 计划id
        }]; 
        T.fetch({ //保费试算
            url:'/cal/premium/amount.json',
            data:params
        }).then((res)=>{
            if(res.success){
                this.setState({amount: res.value[0].calResp.calValue})
            }
        })
    }

    onChangeRiskNotice = (obj) => {
        this.setState(obj)
    }

    submitAction = () => {
        let tipsResult = JSON.parse(sessionStorage.getItem("tipsResult")); 
        sessionStorage.setItem("Insure4",  JSON.stringify(this.state.companyInfo));        
        let param = {
            ensurePersons: [{              
                ensurePlanId: T.urlQuery('planId'),
                insurantPremium: this.state.amount,  
                relation:'SELF',            
                paymentFrequency:"SINGLE"              
            }],            
            goodsId: T.urlQuery('goodId'),
            campaignId: T.urlQuery('campaignId'),
            orderPropertyDTO:Object.assign(this.state.companyInfo,{userType:'COMPANY'}), //财产险订单数据
            tipsResult
        };
        console.log('param', param)       
        if(!this.state.showRiskNotice){
            T.showError("Plear Agree Notice Of Insurance And Clauses Of Insurance");
        }else{
            this.requestSubmit(param)
        }

    }

    requestSubmit = (param) => {
        T.fetch({ 
            url:'/order/submit.json',
            loading:true,
            data:param
        }).then((res)=>{
            if(res.success){
                console.log("res", res)
                actions.routing.push({
                    pathname: 'pay',
                    search: `?id=${res.value.orderNo}`
                })
            }
        })
    }

    render() {
        let {companyInfo, factorInfo, goodId} = this.state;
        console.log(this.state)
        return (
            <div className="insure">
                <div className="title">企业信息</div>
                <div>
                    <List>
                        <RowInput label="企业名称" name="companyName" language='English' value={companyInfo.companyName} callback={this.onChangeCompanyInfo} />
                        <RowSelect label="企业类型" name="companyType" value={companyInfo.companyType} data={CompanyTypeEnum()} callback={this.onChangeCompanyInfo} />
                        <RowInput label="证件号码" name="companyCertiNo"  value={companyInfo.companyCertiNo} callback={this.onChangeCompanyInfo} />
                        <RowInput label="企业地址" name="companyAddress" value={companyInfo.companyAddress} callback={this.onChangeCompanyInfo} />
                    </List>
                </div>
                <div className="title">企业联系人信息</div>
                <div>
                    <List>                       
                        <RowInput label="姓名" name="companyContactsName"  value={companyInfo.companyContactsName} callback={this.onChangeCompanyInfo} />                       
                        <RowInput label="手机号码" type="phone" name="companyContactsMobile"  value={companyInfo.companyContactsMobile} callback={this.onChangeCompanyInfo} />
                        <RowInput label="E-mail" name="companyContactsEmail"  value={companyInfo.companyContactsEmail} callback={this.onChangeCompanyInfo} />
                    </List>
                </div>
                <div className="title">投保雇员信息</div>
                <div>
                    <List>                       
                        <RowInput label="1-3类职业雇员人数" name="oneToThreeEmployeeNum"  value={companyInfo.oneToThreeEmployeeNum} callback={this.onChangeCompanyInfo} />                        
                        <RowInput label="4类职业雇员人数" name="fourEmployeeNum"  value={companyInfo.fourEmployeeNum} callback={this.onChangeCompanyInfo} />                       
                    </List>  
                </div>
                <div className="title">投保财产信息</div>
                <div>
                    <List>
                        <RowInput label="场所地址" name="placeAddress"  value={companyInfo.placeAddress} callback={this.onChangeCompanyInfo} />                        
                        <RowInput label="场所面积" name="placeMeasure"  value={companyInfo.placeMeasure} callback={this.onChangeCompanyInfo} />                        
                        <RowSelect label="产权性质" name="propertyType"  value={companyInfo.propertyType} data={PropertyTypeEnum()} callback={this.onChangeCompanyInfo} /> 
                        <RowSelect label="建筑结构" name="buildingStructType"  value={companyInfo.buildingStructType} data={BuildingStructTyepEnum()} callback={this.onChangeCompanyInfo} /> 
                    </List>
                </div>
                <div className="title">扩展条款信息</div>
                <RowSelect label="附加扩展非工作期间意外身故伤残条款" name="isExtensionClause"  value={companyInfo.isExtensionClause} data={YesNoEnum()} callback={this.onChangeCompanyInfo} /> 
                {/*<div>      
                    <List>         
                        <span className="rSpan" >附加</span>                                
                        <RadioItem>
                        </RadioItem> 
                        <span className="rSpan" >不附加</span> 
                        <RadioItem>
                        </RadioItem>   
                    </List>             
                </div>*/}
                <RiskNotice callback={this.onChangeRiskNotice} goodId={T.urlQuery('goodId')} />
                <div className="footer">
                    <div className="footer-left">
                        <a className="f38 fc6 tac color-price">&nbsp;&nbsp;<span className="f30"></span><span id="totalMoney">{this.state.amount || 0}</span></a>
                    </div>
                    <div className="footer-right">
                        <a href="javascript:;"  className="f32 fcw diy_background" id="applyBtn" onClick={this.submitAction}>Buy</a>
                    </div>
                </div>
            </div>
        )
    }
}

export default App;